<template>
  <div id="app">
    <!-- button组件扩展 -->
    <!-- <i-button @on-click="handleClick" size="large" >
      <i-icon slot="icon" type="checkmark"></i-icon>
    </i-button>
    <i-button disabled >
      <em>按钮2</em>
    </i-button> -->
    <!-- 子组件通过自定义事件注册事件 -->
    <i-button @on-click="handleClick"></i-button>
    <component-aa ref="comA"></component-aa>
    <form-table></form-table>
  </div>
</template>

<script>
import iButton from './components/common-button'
import componentAa from './components/communication-element/component-a'
import formTable from './views/form'
export default {
  name: 'app',
  components: {
    iButton,
    componentAa,
    formTable
  },
  data(){
    return{

    }
  },
  mounted () {
    //跨组件通信
    console.log(this.$refs);
    const comA = this.$refs.comA;
    comA.sayHello();
  },
  methods:{
    handleClick(event){
      console.log(event)
    }
  }
}
</script>

<style>

</style>
